<template>
	<div class="context">
		<div class="center">
			<div class="xi">
				<div class="yuan">2</div>
				<div class="zho">
					{{ this.$route.query.i }}
				</div>
			</div>
			<!-- 内容区域 -->
			<div class="text richText" v-html="list"></div>
		</div>
	</div>
</template>
 
 <script>
import { coffeeRun } from "@/api/index"
export default {
	data() {
		return {
			list: ''
		}
	},
	created() {
		coffeeRun(sessionStorage.getItem("coffeetitle")).then((res) => {
			if (res.data.code == 200) {
				this.list = this.dataHTML(res.data.data.coffeeRun)

			}
		})
	},

}
 </script>
 
 <style scoped>
.context {
	width: 100%;
	height: 6rem;
	display: flex;
	justify-content: center;
	background-color: #f0eff5;
}
.center {
	width: 98%;
}
.xi {
	width: 100%;
	margin-top: 0.05rem;
	display: flex;
}
.xi .yuan {
	width: 0.16rem;
	height: 0.16rem;
	margin-left: 0.1rem;
	font-weight: 700;
	text-align: center;
	line-height: 0.16rem;
	border-radius: 50%;
	margin-top: 0.05rem;
	border: 1px solid black;
}

/* 中间区域 */
.xi .zho {
	height: 100%;
	line-height: 0.3rem;
	padding-left: 5px;
	font-weight: 700;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}
/* 内容区域 */
.text {
	width: 100%;
	font-weight: 700;
	word-wrap: break-word;
	text-indent: 0.2rem;
}
</style>